<template>
  <div class="page">
    <nav>
      <ul>
        <li>
          <router-link to="/">博客</router-link>
        </li>
        <li>
          <router-link to="/add">写博客</router-link>
        </li>
      </ul>
    </nav>
  </div>
</template>

<script type="text/ecmascript-6">
export default {
  data() {
    return {};
  },
  components: {}
};
</script>

<style scoped>
ul {
  list-style: none;
  text-align: center;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  text-decoration: none;
  padding: 12px;
  color: #999;
  border-radius: 4px;
}
.active {
  color: #333;
}
nav {
  /* background-color: #ddd; */
  padding: 2px;
  box-shadow: 0px 2px 0px #ddd;
  max-width: 800px;
  margin: 0 auto;
}
</style>
